const path = require('path')

function resolve(dir) {
  return path.join(__dirname, dir)
}

const packageName = 'vue2'
const port = 8001

module.exports = {
  outputDir: 'dist', // 打包的目录
  assetsDir: 'static', // 打包的静态资源
  filenameHashing: true, // 打包出来的文件，会带有hash信息
  publicPath: 'http://localhost:8001',
  devServer: {
    contentBase: path.join(__dirname, 'dist'),
    hot: false,
    disableHostCheck: true,
    port,
    headers: {
      'Access-Control-Allow-Origin': '*' // 本地服务的跨域内容
    }
  },
  // 自定义webpack配置
  configureWebpack: {
    resolve: {
      alias: {
        '@': resolve('src')
      }
    },
    output: {
      // 把子应用打包成 umd 库格式
      // umd模块化可以支持不同模块化下定义的代码也能够同时运行在浏览器和node环境下，而不是单单只能让一端支持
      // 该模块在 CommonsJS、 AMD 和脚本标记中都可以使用
      libraryTarget: 'umd',
      // 打包出来的名字 打包出来后会加一个hash的内容
      filename: 'vue2.[name].js',
      // 可以使我们在当前的全局环境下获取到打包的内容
      // 在控制台中 我们输入 window.vue2 可以发现有打印的信息 是一个对象
      // 也就是说 可以在当前的window环境下 通过 window.vue2 来获取到这个子应用打包的内容
      // library: `${packageName}`, // https://webpack.docschina.org/configuration/output/#outputlibrary
      library: `${packageName}-[name]`,
      jsonpFunction: `webpackJsonp_${packageName}`
    }
  }
}
